<!doctype html>
<html lang="ch" xmlns:th="http://www.thymeleaf.org">
<head></head>
<body>
<div class="container" style=" padding:20px;background-color: #ffffff;width: 80%" th:fragment="topicshow">

    <div class="row">
        <div class="col-lg-12 ">
            <h2><span class="glyphicon glyphicon-list" aria-hidden="true"></span> 发现 </h2>
            <hr>
        </div>
        <div id="topics-top" th:each="topicUser:${topicUserMapTop}">
            <div class="media-left">
                <a href="#">
                    <img width="60px" class="media-object img-circle picset" th:src="${topicUser.value.profilePhoto}">
                </a>
            </div>
            <div class="media-body ">
                <div style="color:#C9CDD4; margin-bottom: 10px">
                    <span>[[${topicUser.key.title}]]</span>
                    <span style="margin: 5px;display: inline-block;color: #e2b46e;background-color:#f8e7c4;">白金会员</span>
                    <span>发表时间： [[${topicUser.key.createTime}]]</span>
                    <span style="margin-left: 20px; " class="glyphicon glyphicon-eye-open align-middle">
                        </span><span class="align-middle"
                                     style="vertical-align: auto">[[${topicUser.key.browseCount}]]</span>
                    <span style="margin-left: 20px;"
                          class="glyphicon glyphicon-comment">[[${topicUser.key.commentCount}]]</span>
                    <span class=" glyphicon glyphicon-thumbs-up"
                          style="margin-left: 20px;">[[${topicUser.key.thumbsCount}]]</span>
                </div>
                <div>
                        <span style="margin-top: 10px;">
                            <h4 class="media-heading" style="font-size: 20px;">
                                <a th:href="|../article/getTopicById?id=${topicUser.key.id}|">[[${topicUser.key.title}]]</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    <span th:if="${topicUser.key.status == '10'or topicUser.key.status == '11'}"
                                          class="top">置顶</span>
                                <span th:if="${topicUser.key.status == '01'or topicUser.key.status == '11'}"
                                      class="essence">精华</span>
                            </h4>
                        </span>
                </div>
                <div class="topic-content"
                     style="padding:5px;margin: 0px 50px 0 0;font-size: 15px;line-height: 28px;font-weight: normal;text-decoration: none;color: #86909C;">
                    [[${topicUser.key.content}]]
                </div>
            </div>
            <hr>
        </div>

        <div id="topics" th:each="topicUser:${topicsAndUser}">
            <div class="media-left">
                <a href="#">
                    <img width="60px" class="media-object img-circle picset" th:src="${topicUser.value.profilePhoto}">
                </a>
            </div>
            <div class="media-body ">
                <div style="color:#C9CDD4; margin-bottom: 10px">
                    <span>[[${topicUser.value.name}]]</span>
                    <span style="margin: 5px;display: inline-block;color: #e2b46e;background-color:#f8e7c4;">白金会员</span>
                    <span>发表时间： [[${topicUser.key.createTime}]]</span>
                    <span style="margin-left: 20px; " class="glyphicon glyphicon-eye-open align-middle">
                        </span><span class="align-middle"
                                     style="vertical-align: auto">[[${topicUser.key.browseCount}]]</span>
                    <span style="margin-left: 20px;"
                          class="glyphicon glyphicon-comment">[[${topicUser.key.commentCount}]]</span>
                    <span class=" glyphicon glyphicon-thumbs-up"
                          style="margin-left: 20px;">[[${topicUser.key.thumbsCount}]]</span>
                </div>
                <div>
                        <span style="margin-top: 10px;">
                            <h4 class="media-heading" style="font-size: 20px;">
                                <a th:href="|../article/getTopicById?id=${topicUser.key.id}|">[[${topicUser.key.title}]]</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                     <span th:if="${topicUser.key.status == '10'||topicUser.key.status == '11'}"
                                           class="top">置顶</span>
                                  <span th:if="${topicUser.key.status == '01'||topicUser.key.status == '11'}"
                                        class="essence">精华</span>
                            </h4>
                        </span>
                </div>
                <div class="topic-content"
                     style="padding:5px;margin: 0px 50px 0 0;font-size: 15px;line-height: 28px;font-weight: normal;text-decoration: none;color: #86909C;">
                    [[${topicUser.key.content}]]
                </div>
            </div>
            <hr>
        </div>
    </div>
    <div>
        <div style="float: right;margin-right: 50px;line-height: 36px;font-size: 14px;" class="pg">
            <span class="count">共[[${pageInfo.list}]]条</span>
            <a th:if="${pageInfo.hasPreviousPage}" class="page-next" th:onclick="pageList('${pageInfo.pageNum} - 1')">上一页</a>
            <label class="lable-page">
                <span title="">每页显示</span>
                <input onkeydown="if(event.keyCode==13) {pageList('[[${p}]]');}" class="input-page page-size"
                       title="输入每页显示记录数，按回车跳转" th:value="${pageInfo.pageSize}">
                <span title="">条</span>
            </label>

            <label class="lable-page">
                <input onkeydown="if(event.keyCode==13) {pageList(this.value);}" class="input-page page-num"
                       title="输入页码，按回车跳转" th:value="${pageInfo.pageNum}" size="2">
                <span th:text="|/共${pageInfo.total}页|"> /[[${totalPage}]]页</span>
            </label>
            <a th:if="${pageInfo.nextPage} != ${pageInfo.total}" class="page-next" th:onclick="pageList()">下一页</a>

        </div>
    </div>
</div>

</div>

</body>
</html>
